import React, {CSSProperties} from "react";
import { GridContent} from '@ant-design/pro-layout';
import {PureSettings} from "@ant-design/pro-layout/lib/defaultSettings";
import styles from "./index.less";

interface GridContainerProps{
  contentWidth?: PureSettings['contentWidth'];
  children: React.ReactNode;
  className?: string;
  style?: CSSProperties;
  prefixCls?: string;
  hasFooter?: boolean;
  footerHeight?: number;
}
export default class GridContainer extends React.PureComponent<GridContainerProps,{}>{

  static defaultProps = {
    hasFooter:false,
    footerHeight:44,
  }

  render() {
    const {children,hasFooter,footerHeight}=this.props;
    let style={height: '100%'};
    if(hasFooter){
      style={height: `calc(100% - ${footerHeight}px)`}
    }
    return (
      <GridContent className={styles['grid-container']} style={style}>
        <GridContent {...this.props}>
          {children}
        </GridContent>
      </GridContent>
    );
  }
}
